<template>
  <div class="base-table-box">
    <div class="table-select-group">
      <div class="left">
        <s-select
          :selectOption="proposal.proposalSessionId"
          v-model="params.strYear"
        />
        <proposal-type-select
          style="width: 180px"
          placeholder="=提案类别="
          v-model="params.proposalType"
        />
        <s-select
          style="width: 140px"
          :selectOption="proposal.reporterType"
          placeholder="=提案者类型="
          v-model="params.reporterType"
        />
        <s-select
          style="width: 130px"
          :selectOption="proposal.meeting"
          placeholder="=会中提案="
          v-model="params.meeting"
        />
        <s-select
          style="width: 80px"
          :selectOption="proposal.searchType3"
          v-model="params.type"
        />
        <a-input
          class="search-input"
          v-model="params.search"
          placeholder="请输入搜索内容"
        />
        <a-button style="margin-left: 16px" type="primary" @click="start"
          >查询</a-button
        >
        <a-button @click="reset" class="btn-reset">重置</a-button>
      </div>

      <div class="right">
        <a-button type="primary" @click="deleteList(selectedRowKeys)"
          >批量交办</a-button
        >
      </div>
    </div>

    <a-table
      :row-selection="{
        selectedRowKeys: selectedRowKeys,
        onChange: onSelectChange
      }"
      :pagination="pagination"
      :columns="columns"
      :data-source="tableData"
      :loading="loading"
      :scroll="{ y: '100%' }"
    >
      <span slot="action" slot-scope="text, record">
        <a-button type="primary" @click="deleteList(selectedRowKeys)"
          >交办</a-button
        >
        <a-button type="primary" @click="isShowModal = true">调整</a-button>
      </span>
    </a-table>
    <s-modal
      ref="modalForm"
      class="s-modal"
      :visible="isShowModal"
      title="调整"
      @cancel="isShowModal = false"
    >
      <a-form-model class="form" layout="vertical" :colon="false">
        <a-form-model-item label="由承办系统分发">
          <a-radio-group>
            <a-radio value="1">主办</a-radio>
            <a-radio value="2">分办</a-radio>
            <a-radio value="3">主会办</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item label="承办系统"> <a-input /></a-form-model-item>
        <a-form-model-item label="办理类型">
          <a-radio-group>
            <a-radio value="1">主办</a-radio>
            <a-radio value="2">分办</a-radio>
            <a-radio value="3">主会办</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item label="主办单位">
          <a-input @click="choiceVisible = true" />
        </a-form-model-item>
        <a-form-model-item label="会办单位">
          <a-input />
        </a-form-model-item>
        <a-form-model-item label="主办应答复日期">
          <a-input />
        </a-form-model-item>
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="会办应答复日期">
              <a-input />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </s-modal>
    <choice-modal :visible.sync="choiceVisible" />
  </div>
</template>
<script>
import paging from 'mixins/paging'
import deleteItem from 'mixins/delete-table-item.js'
import { proposal } from 'assets/js/select-option-list'
import proposalTypeSelect from 'components/form/proposalTypeSelect'
import choiceModal from 'components/base/choiceModal'
const columns = [
  {
    title: '案号',
    dataIndex: 'caseNo',
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '题目',
    dataIndex: 'name'
  },
  {
    title: '提案类别',
    dataIndex: 'proposalType'
  },
  {
    title: '提案者',
    dataIndex: 'proposer'
  },
  {
    title: '提交事件',
    dataIndex: 'pubDate',
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '操作',
    dataIndex: 'action',
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  data() {
    return {
      columns,
      proposal,
      isShowModal: false,
      params: {
        strYear: '0',
        search: '',
        type: '',
        proposalType: undefined,
        reporterType: undefined,
        meeting: undefined
      },
      choiceVisible: false
    }
  },
  mixins: [paging, deleteItem],
  components: { proposalTypeSelect, choiceModal },
  methods: {
    start() {
      console.log(this.form)
      // this.loading = true
      // // ajax request after empty completing
      // setTimeout(() => {
      //   this.loading = false
      //   this.selectedRowKeys = []
      // }, 1000)
    },
    reset() {
      this.form = {}
    },
    add() {
      this.$router.push('./addnotice')
    },
    deleteList(ids) {
      this.deleteItemMixins(() => {}, ids)
    },
    getTableData() {
      for (let i = 0; i < this.pagination.pageSize; i++) {
        this.tableData.push({
          key: i,
          name: `Edward King ${i}`,
        })
      }
      this.pagination.total = 200
    }
  }
}
</script>